<template>
	<view class="infoWrap">
		<view class="inner">
			<view class="zxrName">
				<image class="bgImg" src="../../../static/images/infoBg.png"></image>
				<image class="defImg" :src="defHead"></image>
				<view class="username">{{zxrInfo.zxrName}}</view>
				<view>{{zxrInfo.zxrMobile}} | {{zxrInfo.sex}}</view>
			</view>
			<view class="infoItem">
				<view class="infoTit">现存情况:</view>
				<view class="itemCon">{{zxrInfo.currInfo}}</view>
			</view>
			<view class="infoItem">
				<view class="infoTit">紧急联系人:</view>
				<view class="itemCon">{{zxrInfo.lxrName}}<text class="margL">({{zxrInfo.ralation}})</text><text class="margL">{{zxrInfo.lxrMobile}}</text></view>
			</view>
			<view class="infoItem">
				<view class="infoTit">过往经历:</view>
				<view class="itemCon">
					<view class="item spaceBet">
						<view>1.是否接受过心理咨询?</view>
						<view class="otherCol">{{(zxrInfo.experience || '').split(',')[0]}}</view>
					</view>
					<view class="item spaceBet">
						<view>2.是否接受过精神科相关的诊断或治疗?</view>
						<view class="otherCol">{{(zxrInfo.experience || '').split(',')[1]}}</view>
					</view>
					<view class="item spaceBet">
						<view>3.是否有过自伤/自杀的想法或行为?</view>
						<view class="otherCol">{{(zxrInfo.experience || '').split(',')[2]}}</view>
					</view>
					<view class="item spaceBet">
						<view>4.从哪知道该平台的?</view>
						<view class="otherCol">{{(zxrInfo.experience || '').split(',')[3]}}</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	//import { getZxrInfo } from '@/api/xlzx/index'
	export default {
		data(){
			return{
				detId:'',
				zxrInfo:[],
				defHead:this.defHead,
			}
		},
		onLoad(options){
			this.detId = options.id;
			//this.loadZxrInfo();
		},
		methods:{
			loadZxrInfo(){
				var field = { id:this.detId };
				getZxrInfo(field).then(res=>{
					this.zxrInfo = res.data.datas;
				}).catch(err=>{
					console.log(err)
				});
			},
		}
	}
</script>

<style lang='scss'>
	page{
		background: $pss-bg-primary;
	}
	.infoWrap{
		padding: 20rpx 30rpx;
		.inner{
			background: #fff;
			border-radius: 20rpx;
			.infoItem{
				margin-top: 20rpx;
				padding: 0 20rpx 20rpx;
				.infoTit{
					font-size:26rpx;
					color: $pss-text-color8;
					margin-bottom: 10rpx;
				}
				.itemCon{
					font-size: 28rpx;
					color: $pss-text-color3;
					.margL{
						margin-left: 10rpx;
					}
					.item{
						line-height: 60rpx;
						.otherCol{
							color: $pss-color-blueDeep;
						}
					}
				}
			}
			.zxrName{
				height: 152rpx;
				background:$pss-color-blueDeep;
				border-radius: 20rpx 20rpx 0 0;
				color: #fff;
				display: flex;
				align-items: center;
				font-size: $font-size26;
				padding:0 20rpx;
				position: relative;
				.bgImg{
					width: 348rpx;
					height: 152rpx;
					position: absolute;
					left: 0;
					top: 0;
					z-index: 0;
				}
				.defImg{
					width: 80rpx;
					height: 80rpx;
					border-radius: 50%;
					margin-right: 15rpx;
				}
				.username{
					font-size: $font-size32;
					font-weight: bold;
					margin-right: 15rpx;
				}
			}
		}
	}
</style>